<template>
	<section class="container">
		<el-row>
			<el-col :span="24" class="userTitle">
				<p>文件列表</p>
			</el-col>
		</el-row>
		<el-row>
			<el-col :span="24" class="userContent">
				<a href="" download="">windows7 64位版</a>
				<a href="" download="">windows7 32版本</a>
				<a href="" download="">windowsXP 32版本</a>
			</el-col>
		</el-row>
	</section>
</template>
<style lang="scss" scoped>
	.container {
		.userTitle {
			text-align: left;
			font-size: 22px;
			color: #444;
			height: 60px;
			border-bottom: 4px solid #cdd1da;
			line-height: 60px;
			padding-left: 20px;
		}
		.userContent {
			padding: 60px 0 0;
			text-align: center;
			a {
				color: #444;
				font-size: 18px;
				text-decoration: underline;
				margin-right: 100px;
			}
		}
	}
</style>
<script>
	export default {
		methods: {
			judgeOS: function() {
				var children = this.$el.children[1].children[0].children;
//				console.log(children[0]);
				var agent = navigator.userAgent.toLowerCase();
				var version = Number(agent.substr(agent.indexOf("nt"), 7).split(" ")[1]);
//				console.log(agent.substr(agent.indexOf("nt"), 7).split(" ")[1]);
				if(version >= 6.1) { // win7 以上
					if(agent.indexOf("wow64") !== -1 || agent.indexOf("win64") !== -1) { // 64bit
						// download win7 64bit installer
					      children[0].innerHTML=children[0].innerHTML+"<span style='color:red;'>(推荐)</span>";
					}else{// 32bit 
						// download win7 32bit installer
						children[0].innerHTML=children[0].innerHTML+"<span style='color:red;'>(推荐)</span>";
					}
				}else{// xp 32bit installer
					children[0].innerHTML=children[0].innerHTML+"<span style='color:red;'>(推荐)</span>";
				}
			}
		},
		mounted(){
			this.judgeOS();
		}
	}
</script>